 .pre {
     height: 100%;
 }

 .input-mini {
     width: 80px !important;
 }


 .input-mid {
     width: 200px !important;
 }

 .div-padding {
     padding-right: 10px;
 }

 .el-main {
     padding: 50px 20px 0 20px !important;
 }

 .body {
     height: 100%;
 }

 .bg {
     background-color: aliceblue !important;
     height: 20% !important;
 }

 .header {
     display: flex;
     flex-direction: row;
     align-items: center;
 }

 .head-color {
     background-color: #f5f7fa;
     color: #333;
     font-weight: bold;
 }

 .data {
     height: 100%;
 }

 .upload {
     padding-left: 7px;
 }

 .case-list {
     display: flex;
     flex-wrap: wrap;
 }

 .case {
     width: 50px;
     height: 50px;
     border-radius: 10px;
     box-shadow: 1px 1px 2px rgb(129, 123, 123);
     margin: 0 10px 10px 0;
     display: flex;
     justify-content: center;
     align-items: center;
 }

 .number {
     font-size: 24px;
     font-weight: bolder;
 }

 .monitor-info {
     display: flex;
     flex-direction: row;
     justify-content: center;
     align-items: center;
 }

 .monitor-process {
     width: 85%;
 }

 .monitor-success {
     width: 10%;
 }

 .wait {
     background-color: #51a1e0;
     animation: breathe 0.5s infinite alternate;
 }

 .success {
     background-color: #79d562;
 }

 .fail {
     background-color: #da4b4b;
 }

 @keyframes breathe {
     0% {
         opacity: 0.7;
     }

     100% {
         opacity: 1;
     }
 }